<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>more</title>
		 <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">

		<link rel="stylesheet" type="text/css" href="more.css"/>
		<script src="https://cdn.bootcss.com/jquery/1.10.2/jquery.js"></script>
		<link href="https://cdn.bootcss.com/weui/0.4.1/style/weui.css" rel="stylesheet">
	</head>
	<body>
		<div class="content">
		    <div class="weui_panel weui_panel_access">
		        <div class="weui_panel_hd">文章列表</div>
		        <div class="weui_panel_bd js-blog-list">
		           
		        </div>
		    </div>
		    
		    <!--加载更多按钮-->
		    <div class="js-load-more">加载更多</div>
		    
		</div>

		<script src="more.js"></script>
		<script>
			$(function(){
			
			    /*初始化*/
			    var counter = 0; /*计数器*/
			    var pageStart = 0; /*offset*/
			    var pageSize = 7; /*size*/
			    var isEnd = false;/*结束标志*/
			    
			    /*首次加载*/
			    getData(pageStart, pageSize);
			    
			    /*监听加载更多*/  
			    $(window).scroll(function(){
			        if(isEnd == true){
			            return;
			        }
			
			        // 当滚动到最底部以上100像素时， 加载新内容
			        // 核心代码
			        if ($(document).height() - $(this).scrollTop() - $(this).height()<100){
			            counter ++;
			            pageStart = counter * pageSize;
			            
			            getData(pageStart, pageSize);
			        }
			    });
			});
					</script>
	</body>
</html>
